<template>
   <div>
      <el-form ref="form" :model="addData" label-width="80px">
         <el-form-item label="名称">
            <el-input v-model="addData.title"></el-input>
         </el-form-item>
         <div v-if="type_id!=3">
            <div v-if="type_id==1">
               <el-form-item label="分组">
                  <el-select v-model="addData.cate" placeholder="请选择分组" @change="getCate1">
                     <el-option v-for="sort in sortList" :key="sort.id" :label="sort.title"
                                :value="sort.id"></el-option>
                  </el-select>
               </el-form-item>
               <el-form-item label="上级分类">
                  <el-select v-model="cate1" placeholder="请选择分类" @change="getCate2">
                     <el-option v-for="cate in cate1List" :key="cate.id" :label="cate.title"
                                :value="cate.id"></el-option>
                  </el-select>
                  <el-select v-model="cate2" placeholder="请选择分类" @change="getCate3">
                     <el-option v-for="cate in cate2List" :key="cate.id" :label="cate.title"
                                :value="cate.id"></el-option>
                  </el-select>
                  <el-select v-model="cate3" placeholder="请选择分类">
                     <el-option v-for="cate in cate3List" :key="cate.id" :label="cate.title"
                                :value="cate.id"></el-option>
                  </el-select>
               </el-form-item>
            </div>
            <div v-else>
               <el-form-item label="图片">
                  <input type="file" ref="pic" @change="upImg">
               </el-form-item>
               <el-form-item label="超链接">
                  <el-input v-model="addData.url"></el-input>
               </el-form-item>
            </div>
         </div>
         <el-form-item>
            <el-button type="primary" @click="postAdv">添加</el-button>
            <el-button @click="clearData">清空</el-button>
         </el-form-item>
      </el-form>
   </div>
</template>

<script>
   export default {
      name: "AdvAdd",
      data() {
         return {
            type_id: this.$route.query.type_id,
            sortList: [],
            cate1List: [],
            cate2List: [],
            cate3List: [],
            cate1: '',
            cate2: '',
            cate3: '',
            addData: {},
         }
      },
      created() {
         this.$axios({
            url: 'adminapp/adv/',
            params: {
               type_id: this.type_id,
            }
         }).then(resp => {
            this.sortList = resp.data
         })
      },
      methods: {
         getCate1(id) {
            this.$axios({
               url: 'adminapp/adv/',
               params: {
                  type_id: this.type_id,
                  cate_id: id,
               }
            }).then(resp => {
               this.cate1List = resp.data
            })
         },
         getCate2(id) {
            this.$axios({
               url: 'adminapp/adv/',
               params: {
                  type_id: this.type_id,
                  cate_id: id,
               }
            }).then(resp => {
               this.cate2List = resp.data
            })
         },
         getCate3(id) {
            this.$axios({
               url: 'adminapp/adv/',
               params: {
                  type_id: this.type_id,
                  cate_id: id,
               }
            }).then(resp => {
               this.cate3List = resp.data
            })
         },
         upImg(){
            this.addData['pic'] = this.$refs.pic.files[0]
         },
         postAdv() {
            let data = new FormData();
            data.append('type', this.type_id);
            // data.append('pic', );
            for (let i in this.addData) {
               data.append(i, this.addData[i])
            }
            if (this.cate1) {
               data.set('cate', this.cate1);
               data.append('level', 2)
            }
            if (this.cate2) {
               data.set('cate', this.cate2);
               data.append('level', 3)
            }
            this.$axios({
               url: 'adminapp/adv/',
               method: 'POST',
               data: data
            }).then(resp => {
               console.log(resp.data.msg);
               if (resp.data.code == 200) {
                  // alert(resp.data.msg);
                  this.addData = {
                     'type': this.$route.query.type_id,
                  }
               } else {
                  alert('NO');
                  // console.log(resp.data.msg)
               }
            })
         },
         clearData() {
            this.addData = {
               'type': this.$route.query.type_id,
            }
         }
      },
      computed: {},
      filters: {},
      watch: {},
   }
</script>

<style scoped>

</style>
